<template>
  <el-dialog
    title="常用意见"
    v-bind="$attrs"
    width="40%"
    :append-to-body="true"
    :modal-append-to-body="true"
    :modal="true"
    :close-on-click-modal="false"
    v-on="$listeners"
  >
    <div>
      <div style="margin-bottom: 5px">
        <el-button class="pms-button-primary" @click="addOpinion">自定义</el-button>
      </div>
      <div>
        <el-table :data="opinions" border>
          <el-table-column align="center" type="index" label="序号" />
          <el-table-column align="left" label="办理意见" prop="opinion" />
          <el-table-column align="center" prop="name" label="操作">
            <template slot-scope="scope">
              <el-button type="text" icon="el-icon-delete" @click="deleteOpinion(scope.row.id)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>

    <add-opinion v-if="ifAddOpinion" :visible.sync="ifAddOpinion" @addSuccess="getCommonOpinions" />
  </el-dialog>
</template>

<script>
    import { getCommonOpinion, deleteCommonOpinion } from '@/api/workFlow'
    import AddOpinion from '@/components/nextPerson/addOpinion'

    export default {
        name: 'CommonOpinion',
        components: { AddOpinion },
        data() {
            return {
                opinions: [],
                ifAddOpinion: false
            }
        },
        mounted() {
            this.getCommonOpinions()
        },
        methods: {
            // 获取常用意见
            getCommonOpinions() {
                getCommonOpinion().then(res => {
                    if (+res.code !== 200) {
                      return Promise.reject(res)
                    }
                    this.opinions = res.data
                })
            },
            // 删除常用意见
            deleteOpinion(id) {
                this.$confirm('确定删除此办理意见？', '提示', {
                    distinguishCancelAndClose: true,
                    confirmButtonText: '是',
                    confirmButtonClass: 'pms-zr-button-primary',
                    cancelButtonText: '否',
                    cancelButtonClass: 'pms-zr-button',
                    type: 'info'
                }).then(() => {
                    deleteCommonOpinion(id).then(res => {
                        if (+res.code === 200) {
                            this.$message.success('删除成功！')
                            this.getCommonOpinions()
                        } else {
                            this.$message.error('删除失败！')
                        }
                    })
                }).catch(() => {
                    console.log('不删了')
                })
            },
            addOpinion() {
                this.ifAddOpinion = true
            }
        }
    }
</script>

<style scoped>

</style>
